﻿@{
    Layout = null;
    ViewData["Title"] = "BianGen";
}
<script src="~/js/vue.js"></script>
<script src="~/js/axios.js"></script>
<script src="~/element-ui/lib/index.js"></script>
<script type="text/javascript" src="~/js/signalr.js"></script>
<link rel="stylesheet" href="~/element-ui/lib/theme-chalk/index.css" />
<div id="app">
    <template>
        <font color="black">
            您正在做的业务是：人力资源--招聘管理--职位发布管理--职位发布变更
        </font>
        <el-table :data="tableData"
                  style="width: 100%">
            <el-table-column prop="mre_id"
                             label="编号"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column prop="first_kind_name"
                             label="I级机构名称"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column prop="second_kind_name"
                             label="公司名称"
                             width="180">
            </el-table-column>
            <el-table-column prop="third_kind_name"
                             label="III级机构名称"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column prop="major_kind_name"
                             label="职位分类名称"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column prop="major_name"
                             label="职位名称"
                             width="180">
            </el-table-column>
            <el-table-column prop="human_amount"
                             label="招聘人数"
                             width="180">
            </el-table-column>
            <el-table-column prop="regist_time"
                             label="发布时间"
                             width="180">
                <template v-if="(scope.row.regist_time!='0001-01-01T00:00:00')" slot-scope="scope">{{scope.row.regist_time | dateFormat}}</template>
            </el-table-column>
            <el-table-column prop="engage_type"
                             label="招聘类型"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column prop="deadline"
                             label="截止日期"
                             width="180">
                <template v-if="(scope.row.deadline!='0001-01-01T00:00:00')" slot-scope="scope">{{scope.row.deadline | dateFormat}}</template>
            </el-table-column>
            <el-table-column prop="changer"
                             label="变更人"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column prop="change_time"
                             label="变更时间"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column prop="major_describe"
                             label="职位描述"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column prop="engage_required"
                             label="招聘要求"
                             width="180"
                             v-if="false">
            </el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button size="mini"
                               v-on:click="XiuGai(scope.row)">修改</el-button>
                    <el-button size="mini"
                               type="danger"
                               v-on:click="Delete(scope.row.mre_id)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
    </template>
    <!--分页按钮-->
    <el-pagination v-on:size-change="handleSizeChange"
                   v-on:current-change="handleCurrentChange"
                   :current-page="currentPage"
                   :page-sizes="[2,4,6,8]"
                   :page-size="size"
                   layout="total, sizes, prev, pager, next, jumper"
                   :total="rows">
    </el-pagination>
    <!--修改模态框-->
    <el-dialog title="修改"
               :visible.sync="UpdateFrom"
               width="50%">
        <span>
            <el-form :model="Update" :rules="urules" ref="Update" label-width="100px" class="demo-ruleForm">
                <el-form-item label="主键" prop="Mre_id" v-if="false">
                    <el-input readonly v-model="Update.Mre_id"></el-input>
                </el-form-item>
                <el-form-item label="I级机构" prop="First_kind_name" v-if="false">
                    <el-input readonly v-model="Update.First_kind_name"></el-input>
                </el-form-item>
                <el-form-item label="II级机构" prop="Second_kind_name" v-if="false">
                    <el-input readonly v-model="Update.Second_kind_name"></el-input>
                </el-form-item>
                <el-form-item label="III级机构" prop="Third_kind_name" v-if="false">
                    <el-input readonly v-model="Update.Third_kind_name"></el-input>
                </el-form-item>
                <el-form-item label="招聘类型">
                    <el-select v-model="Update.Engage_type" placeholder="请选择招聘类型">
                        <el-option label="校园招聘" value="校园招聘"></el-option>
                        <el-option label="社会招聘" value="社会招聘"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="职位分类" prop="Major_kind_name" v-if="false">
                    <el-input readonly v-model="Update.Major_kind_name"></el-input>
                </el-form-item>
                <el-form-item label="职位名称" prop="Major_name" v-if="false">
                    <el-input readonly v-model="Update.Major_name"></el-input>
                </el-form-item>
                <el-form-item label="招聘人数" prop="Human_amount">
                    <el-input v-model="Update.Human_amount"></el-input>
                </el-form-item>
                <el-form-item label="截止日期" prop="Deadline">
                    <el-col :span="20">
                        <el-date-picker type="date" placeholder="选择日期" v-model="Update.Deadline" style="width: 100%;"></el-date-picker>
                    </el-col>
                </el-form-item>
                <el-form-item label="变更人" prop="Changer">
                    <el-input v-model="Update.Changer"></el-input>
                </el-form-item>
                <el-form-item label="变更时间">
                    <el-input v-model="Update.Change_time" width="20px" readonly="readonly"></el-input>
                </el-form-item>
                <el-form-item label="职位描述">
                    <el-input type="textarea" v-model="Update.Major_describe"></el-input>
                </el-form-item>
                <el-form-item label="招聘要求">
                    <el-input type="textarea" v-model="Update.Engage_required"></el-input>
                </el-form-item>
            </el-form>
        </span>
        <span slot="footer" class="dialog-footer">
            <el-button v-on:click="UpdateFrom = false">取 消</el-button>
            <el-button type="primary" v-on:click="UpdateOk()">确 定</el-button>
        </span>
    </el-dialog>


</div>
<script type="text/javascript">
    var vm = new Vue({
        el: "#app",
        data: {
            tableData: [],
            currentPage: 1,
            //每页显示的行数
            rows: 1,
            //每页多少条数据
            size: 2,
            Update: {
                Mre_id: "",
                First_kind_name: "",
                Second_kind_name: "",
                Third_kind_name: "",
                Engage_type: "",
                Major_kind_name: "",
                Major_name: "",
                Human_amount: "",
                Deadline: "",
                Changer: "",
                Change_time: "",
                Major_describe: "",
                Engage_required: ""
            },
            UpdateFrom: false,
            urules: {},
        },
        methods: {
            Find() {
                axios.get("/ZhiWeiFaBuDengJi/FenYe", { params: { size: this.size, currentPage: this.currentPage } }).then(res => {
                    this.tableData = res.data.zhiWeiFaBuDengJis;
                    this.rows = res.data.rows;
                })
            },
            //点击修改打开模态框  进行传值
            XiuGai(row) {
                this.Update.Mre_id = row.mre_id;
                this.Update.First_kind_name = row.first_kind_name;
                this.Update.Second_kind_name = row.second_kind_name;
                this.Update.Third_kind_name = row.third_kind_name;
                this.Update.Engage_type = row.engage_type;
                this.Update.Major_kind_name = row.major_kind_name;
                this.Update.Major_name = row.major_name;
                this.Update.Human_amount = row.human_amount;
                this.Update.Deadline = row.deadline;
                this.Update.Changer = row.changer != null ? row.changer : sessionStorage.getItem("userName");   //row.changer;
                this.Update.Major_describe = row.major_describe;
                this.Update.Engage_required = row.engage_required;
                this.UpdateFrom = true;
            },
            //点击修改的确定
            UpdateOk() {
                axios.put("/ZhiWeiFaBuDengJi/XiuGai", { Mre_id: this.Update.Mre_id, First_kind_name: this.Update.First_kind_name, Second_kind_name: this.Update.Second_kind_name, Third_kind_name: this.Update.Third_kind_name, Engage_type: this.Update.Engage_type, Major_kind_name: this.Update.Major_kind_name, Major_name: this.Update.Major_name, Human_amount: this.Update.Human_amount, Deadline: this.Update.Deadline, Changer: this.Update.Changer, Change_time: this.Update.Change_time, Major_describe: this.Update.Major_describe, Engage_required: this.Update.Engage_required }).then(res => {
                    if (res.data > 0) {
                        alert("修改成功");
                        this.UpdateFrom = false;
                        this.Find();
                    } else {
                        alert("修改失败");
                    }
                })
            },
            //点击删除
            Delete(mre_id) {
                if (confirm("确定要删除吗?")) {
                    axios.get("/ZhiWeiFaBuDengJi/ShanChu", { params: { mre_id: mre_id } }).then(res => {
                        if (res.data > 0) {
                            alert("删除成功");
                            this.Find();
                        } else {
                            alert("删除失败");
                        }
                    })
                }
            },
            //页码大小改变方法
            handleSizeChange(size) {
                this.size = size;
                this.Find();
            },
            //当前页改变查询
            handleCurrentChange(currentPage) {
                this.currentPage = currentPage;
                this.Find();
            },
            //时间
            tick() {
                var d = new Date();
                var y = d.getFullYear();
                var moth = d.getMonth() + 1;
                var date = d.getDate();
                var h = d.getHours();
                var m = d.getMinutes();
                var s = d.getSeconds();
                var hh = 20 - 1 - h;
                var mm = 60 - 1 - m;
                var ss = 60 - s;
                if (hh > 0) {
                    mm = mm + 60 * hh;
                }
                if (moth < 10) {
                    moth = "0" + moth;
                }
                if (date < 10) {
                    date = "0" + date;
                }
                if (h < 10) {
                    h = "0" + h;
                }
                if (m < 10) {
                    m = "0" + m;
                }
                if (s < 10) {
                    s = "0" + s;
                }
                if (mm < 10) {
                    mm = "0" + mm;
                }
                if (ss < 10) {
                    ss = "0" + ss;
                }
                this.Update.Change_time = y + " - " + moth + " - " + date + " " + h + ": " + m + ": " + s;
            },
            //时间过滤器方法
            TimeGuoLvQi() {
                // 定义时间过滤器，
                Vue.filter('dateFormat', function(originDate, pattern = '') {
                    // 根据给定的时间字符串，得到特定的时间
                    var dt = new Date(originDate)
                    //   yyyy-mm-dd
                    var y = dt.getFullYear()
                    var m = (dt.getMonth() + 1).toString().padStart(2, '0')
                    var d = dt.getDate().toString().padStart(2, '0')
                    if (pattern.toLowerCase() === 'yyyy-mm-dd') {
                        return `${y}-${m}-${d}`
                    } else {
                        var hh = dt.getHours().toString().padStart(2, '0')
                        var mm = dt.getMinutes().toString().padStart(2, '0')
                        var ss = dt.getSeconds().toString().padStart(2, '0')
                        //return `${y}-${m}-${d}`
                        return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
                    }
                })
            },
        },
        mounted() {
            this.Find();
            this.TimeGuoLvQi();
            window.onload = this.tick;
            var out = window.setInterval(this.tick, 1000);
        },
        created() {
            var url = "http://localhost:5064"
            this.connection = new signalR.HubConnectionBuilder().withUrl(url + "/InfoHub").build();
            var t = this;
            //1 监听来自服务器端对ReceiveMessage的调用
            this.connection.on("CheckInfo", function(user, message) {
                //创建li标签
                //var li = document.createElement("li");
                //document.getElementById("messagesList").appendChild(li);
                //li.textContent = `${user} says ${message}`;
                //const h = this.$createElement;
                t.$notify.info({
                    title: user,
                    message: message,
                    duration: 0
                    //position: 'bottom-right'
                });
            });
            //2 开启连接
            this.connection.start().then(function() {
                console.info('开启')
            }).catch(function(err) {
                return console.error(err.toString());
            });
        }
    })
</script>

